<template>
  <view class="container">
    <view class="contain-wrap">
      <u-radio-group v-model="radiovalue" placement="column" @change="groupChange">
        <view class="list-item" v-for="item in managerList">
          <view class="info-item" :data-url="`/actual_real_estate/house_manager_detail?item=${JSON.stringify(
              item
            )}`" @click="handleClickRouter">
            <view class="column">
              <view class="label">人员类型:</view>
              <view class="value">{{
                item.trusteeship == '1' ? "托管人" : "房主本人"
              }}</view>
            </view>

            <view class="column">
              <view class="label">人员姓名:</view>
              <view class="value">{{ item.userName }}</view>
            </view>

            <view class="column">
              <view class="label">联系方式:</view>
              <view class="value">{{ item.phone }}</view>
            </view>
          </view>
          <view class="handel-item">
            <view class="left">
              <u-radio label="设为主要负责人" :name="item.id"> </u-radio>
            </view>
            <view class="right" @click="handleClickDelete(item.id)"
              v-if="((radiovalue !== item.id) && managerList.length > 1)">
              <u-icon name="trash"></u-icon>
              <text> 删除</text>
            </view>
          </view>
        </view>
      </u-radio-group>
    </view>
    <!--出租屋里面 不展示 是有房屋 里面展示-->
    <view class="btns" v-if="['actualRealHouse'].includes(options.source)">
      <button class="submit-btn" type="primary" style="width: 100%"
        :data-url="`/actual_real_estate/house_manager_add?houseid=${fHouseid}&buildingId=${options.buildingId}`"
        @click="handleClickRouter">
        新增负责人
      </button>
    </view>
    <yy-watermark></yy-watermark>
  </view>
</template>

<script>
  import {
    Toast,
    navBack,
    handleClickRouter
  } from "@/utils/util.js";
  import {
    getAction,
    postAction
  } from "@/utils/request.js";
  export default {
    data() {
      return {
        fHouseid: "",
        radiovalue: 0,
        managerList: [],
        options: {}
      };
    },
    onLoad(options) {
      this.fHouseid = options.fHouseid;
      this.options = options
      this.getList();
    },
    onShow() {
      const pages = getCurrentPages();
      const prevPage = pages[pages.length - 2];
      if (prevPage) this.getList();
    },
    methods: {
      handleClickRouter,
      async getList() {
        const {
          result
        } = await getAction(
          `/indeed/house/selectPoliceHouseMain`, {
            fHouseid: this.fHouseid
          }
        );

        this.managerList = result;

        result.find((item) => {
          if (item.isMain == 1) {
            this.radiovalue = item.id;
          }
        });
      },

      async groupChange(e) {
        const res = await postAction(`/indeed/house/setisMainId`, {
          houseid: this.fHouseid,
          id: e,
        });
        Toast(res.message);
        setTimeout(() => {
          uni.reLaunch({
            url: '/actual_real_estate/real_estate_index'
          })
        }, 500)
      },

      handleClickDelete(id) {
        uni.showModal({
          title: "删除",
          content: "删除后不可恢复，请谨慎操作！",
          confirmColor: "#2488F5",
          success: async (res) => {
            if (res.confirm) {
              const res = await getAction(`/indeed/house/deletePoliceHouseMain`, {
                id,
              });
              Toast(res.message);
              this.getList();
            }
          },
        });
      },
    },
  };
</script>

<style scoped lang="scss">
  .container {
    height: 100%;
    display: flex;
    flex-direction: column;
    padding: 22rpx 16rpx;
    background: #f9f9f9;

    .contain-wrap {
      flex: 1;
      min-height: 0;
      overflow: scroll;

      .list-item {
        display: flex;
        flex-direction: column;
        background: #fff;
        width: 712rpx;
        height: 334rpx;
        background: #ffffff;
        border-radius: 16rpx;
        margin-bottom: 10rpx;
        padding: 35rpx;

        .info-item {
          flex: 1;
          display: flex;
          flex-direction: column;
          justify-content: space-around;

          .column {
            display: flex;
            align-items: center;
          }

          .label {
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #aaaaaa;
          }

          .value {
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #333333;
            margin-left: 10rpx;
          }
        }

        .handel-item {
          height: 60rpx;
          padding-top: 20rpx;
          display: flex;
          justify-content: space-between;
          align-items: center;

          font-family: PingFang SC, PingFang SC;
          font-weight: 500;
          font-size: 26rpx !important;
          color: #aaaaaa;

          border-top: 1rpx solid #f0f0f0;

          .right {
            display: flex;
            align-items: center;

            text {
              margin-left: 10rpx;
            }
          }
        }
      }
    }
  }
</style>